import wepy from 'wepy'

export default class GoodsDetail extends wepy.mixin {
  data = {
    active: 0,
    // 商品的 id
    goods_id: '',
    // 商品的详情
    goodsInfo: {},
    // 收货地址
    addressInfo: null
  }

  onLoad(options) {
    console.log(options)
    // 对变量进行赋值
    this.goods_id = options.goods_id

    // 调用获取商品详情数据的方法
    this.getGoodsInfo()
  }

  // 获取商品详情数据
  async getGoodsInfo() {
    const { data: res } = await wepy.get('/goods/detail', {
      goods_id: this.goods_id
    })

    // 判断返回的数据是否成功
    if (res.meta.status !== 200) {
      return wepy.baseToast()
    }

    // 小 bug 解决，在 苹果手机上不支持 webp 图片格式的解决方案
    // 在赋值之前将 图文详情的数据字段图片格式进行替换
    res.message.goods_introduce = res.message.goods_introduce.replace(/.webp/g, '.jpg')

    this.goodsInfo = res.message
    this.$apply()
  }

  methods = {
    // 点击预览图片的方法
    preview(current) {
      wepy.previewImage({
        urls: this.goodsInfo.pics.map(item => item.pics_big),
        // 当前点击的图片
        current: current
      })
    },

    // 获取收货地址
    async chooseAddress() {
      const res = await wepy.chooseAddress()

      if (res.errMsg !== 'chooseAddress:ok') {
        return wepy.baseToast('获取收货地址失败')
      }

      this.addressInfo = res
      wepy.setStorageSync('address', res)
      this.$apply()
    },

    // 加入购物车
    addToCart() {
      // 获取当前商品所有信息
      // 为什么需要获取到当前商品所有信息呢？
      // 因为在加入购物车之前，需要对数据进行处理

      // console.log(this.goodsInfo)
      // 访问全局共享的数据
      // console.log(this.$parent.globalData.cart)
      // 访问全局共享的方法
      // console.log(this.$parent.addCart())
      this.$parent.addGoodsToCart(this.goodsInfo)
      wepy.showToast({
        title: '已加入购物车',
        icon: 'success'
      })
    }
  }

  computed = {
    addressStr() {
      if (this.addressInfo === null) {
        return '请选择收货地址'
      }

      // 待会这个位置，使用解构的方式进行优化
      // const addr = this.addressInfo
      // return addr.provinceName + addr.cityName + addr.countyName + addr.detailInfo
      const { provinceName, cityName, countyName, detailInfo } = this.addressInfo
      return provinceName + cityName + countyName + detailInfo
    },

    total () {
      return this.$parent.globalData.total
    }
  }
}
